{% comment %}
    Renders an article card for a given blog with settings to either show the image or not.

    Accepts:
    - blog: {Object} Blog object
    - article: {Object} Article object
    - image_height: {String} The setting changes the height of the article image, if shown
    - show_image: {String} The setting either show the article image or not. If it's not included it will show the image by default
    - show_date: {String} The setting either show the article date or not. If it's not included it will not show the image by default
    - show_author: {String} The setting either show the article author or not. If it's not included it will not show the author by default

    Usage:
    {% render 'tenways-article-card' blog: blog, article: article, show_image: section.settings.show_image %}
{% endcomment %}

<article class="tenways-main-article article-card{% if article.image == blank or show_image == false %} article-card--no-image{% endif %}" aria-labelledby="Article-{{ article.id }}">
  <a href="{{ article.url }}" class="article-content motion-reduce">
    {%- if show_image == true and article.image -%}
      <div class="article-card__image-wrapper">
       {{ article.excerpt }}
      </div>
    {%- endif -%}

    <div class="article-card__info">
      <p class="article_tags">
        {% for tag in article.tags -%}
          {{ tag  | replace: '-', ' ' }}
        {%- endfor %}
      </p>
      <header class="article-card__header">
        <h2 class="article-card__title" id="Article-{{ article.id }}">
          {{ article.title | escape }}
        </h2>
      </header>
      {%- if article.content.size > 0 -%}
        <p class="article-card__excerpt rte-width">
          {{ article.content | strip_html | truncatewords: 30 }}
        </p>
      {%- endif -%}
      {%- if show_date -%}
      <span class="circle-divider caption-with-letter-spacing">
       {% render 'article-time' %} {{- article.published_at | time_tag: format: 'date' -}}
      </span>
    {%- endif -%}
    {%- if show_author -%}
      <span class="caption-with-letter-spacing">{{ article.author -}}</span>
    {%- endif -%}
      <!-- <div class="article-card__footer">
        {%- if article.comments_count > 0 and blog.comments_enabled? -%}
          <span>{{ 'blogs.article.comments' | t: count: article.comments_count }}</span>
        {%- endif -%}
      </div> -->
    </div>
  </a>
</article>
